Search Guidelines 搜尋指導規則

Usage 用法

搜尋是一種導航方式，它能讓人們在應用程式中快速查詢資訊。使用者在搜尋檢視的搜尋欄或文字框中輸入查詢內容，然後就能看到相關結果。

搜尋檢視，可以顯示動態建議，是搜尋欄的聚焦狀態。

Anatomy 結構

Search bar  搜尋欄

Search view  搜尋檢視

Container 容器

容器包含所有其他元件元素。搜尋欄容器有圓角。在緊湊視窗大小下，搜尋檢視容器為全屏。

Icons and icon buttons 圖示和圖示按鈕

Leading icon  前置圖示

欄的左側應包含一個導航操作（如選單或向上箭頭）或非功能性的搜尋圖示。

尾隨圖示：在搜尋欄的右側可以放置最多兩個圖示。這些圖示可以用來：切換不同的搜尋方式（比如語音搜尋）、執行一個特定功能（比如選擇位置）、開啟更多選項選單

Text 文字

Hinted search text  搜尋提示文字：簡要描述使用者將能夠搜尋的內容。

Input text  輸入文字：使用者開始輸入後，提示的搜尋文字將被輸入的文字替換。

Suggestions and results  建議與結果

搜尋建議和結果會以清晰的列表形式顯示。為了方便使用者快速找到所需內容，可以在結果中顯示使用者頭像或其他重要資訊。

Divider 分隔線

分隔線用來把不同型別的搜尋結果或建議分開，讓內容更容易瀏覽。

Search bar 搜尋欄

搜尋欄放在螢幕頂部，是一個顯眼的搜尋輸入框。如果你的應用主要用來搜尋內容，就應該使用搜尋欄。

Placement  放置位置

搜尋欄位於螢幕中央，通常在螢幕頂部。

Responsive layout  響應式佈局

縮放佈局時，搜尋欄應保持在佈局區域內並相應調整寬度，其內部元素隨父容器縮放而左右錨定。

Behavior  行為

搜尋欄獲得焦點後擴充套件為搜尋檢視，顯示歷史搜尋建議。點選返回可清除焦點和建議。

搜尋檢視通常在點選搜尋欄後顯示，但當搜尋是主要功能時，也可作為預設焦點。

Search 搜尋

使用者可輸入或從建議中選擇搜尋內容，按回車提交後在搜尋欄下方顯示結果。

Scroll 滾動

搜尋欄隨著內容向上滾動消失，一旦使用者向下滾動內容，搜尋欄再次出現

Search view 搜尋檢視

搜尋檢視是用於次要搜尋功能的全屏模態介面，點選搜尋圖示即可訪問。

Responsive layout  響應式佈局

搜尋檢視在緊湊視窗尺寸下為全屏模態，在中型和展開視窗中可以是一個連線到搜尋欄的模態。

在縮放佈局時，考慮搜尋欄的位置和對齊應該如何縮放。

Behavior  行為

Appearing 出現

點選頂部應用欄中的搜尋圖示時，應開啟搜尋檢視模態框。

Search 搜尋

輸入內容時，搜尋欄下方會顯示歷史建議，點選建議或回車可觸發搜尋。

搜尋結果顯示在下方並支援滾動。搜尋欄位需要有指示標識(如搜尋圖示或"結果"標題)。

搜尋文字框在顯示結果時保持可見但不聚焦。返回圖示可重置搜尋狀態，隱藏建議和鍵盤。

Back 返回

Android 系統的"預測性返回"手勢支援搜尋欄滑動。搜尋欄介面和內容會按照使用者手勢的方向縮小，搜尋欄會從邊緣分離，表示將最小化。同時顯示上一螢幕預覽。

Interaction & style  互動與樣式

螢幕閱讀器會根據是否選擇第一個自動建議而調整行為。它會宣佈搜尋欄是自動完成欄位，並在結果出現時進行宣佈。箭頭鍵可導航到第一個建議，閱讀器會讀出自動完成結果。